import React from 'react'
import { Tabs } from 'antd'
import { platformSettingsContext } from './context'
import store from './hooks/hook'
import style from './index.module.less'
import EduitOne from './components/editorOne/index'
import EduitTwo from './components/editorTwo/index'
import EduitThree from './components/editorThree/index'

export default () => {
  const storeData = store()

  const tabsArr = [
    {
      label: '平台概况',
      key: '1',
      children: <EduitOne />,
    },
    {
      label: '操作指南',
      key: '2',
      children: <EduitTwo />,
    },
    {
      label: '公告通知',
      key: '3',
      children: <EduitThree />,
    },
  ]

  return (
    <platformSettingsContext.Provider value={storeData}>
      <div className={style.platformSettingsBox}>
        <Tabs
          defaultActiveKey={storeData.platformConfig.tabsActiveKey}
          activeKey={storeData.platformConfig.tabsActiveKey}
          onChange={storeData.platformConfig.changeTabs}
          items={tabsArr}
        />
      </div>
    </platformSettingsContext.Provider>
  )
}
